import {Button, Checkbox, Form, Input, message} from 'antd';
import React from 'react';
import style from './index.module.scss';
import { login } from 'apis/home';
import {NavLink, useNavigate} from "react-router-dom";
import user from "utils/user";

const Login: React.FC = () => {
    const navigate = useNavigate();
    const onFinish = async (values: {
        username: string,
        password: string;
    }) => {
        let res = await login(values);
        if (res.data.code === 0) {
            message.success(res.data.msg);
            user.set(res.data.data);
            //进入首页
            navigate('/home');
        }else {
            message.warning(res.data.msg);
        }
    };

    const onFinishFailed = (errorInfo: any) => {
        console.log('Failed:', errorInfo);
    };

    return (
        <div className={style.login}>
            <Form
                className={style.form}
                initialValues={{ remember: true }}
                onFinish={onFinish}
                onFinishFailed={onFinishFailed}
                autoComplete="off"
            >
                <Form.Item
                    label="用户名"
                    name="username"
                    rules={[{ required: true, message: 'Please input your username!' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="密码&emsp;"
                    name="password"
                    rules={[{ required: true, message: 'Please input your password!' }]}
                >
                    <Input.Password />
                </Form.Item>


                <Form.Item wrapperCol={{ offset: 12, span: 16 }}>
                    <Button type="primary" htmlType="submit">
                        登录
                    </Button>
                </Form.Item>
            </Form>
        </div>
    );
};

export default Login;
